//养护基地
var vm = new Vue({
	el: '#app',
	data: function() {
		return {
			roadNameArray: [],
			roadValueArray: [],
			workNameArray: [],
			workValueArray: [],
			topSetName: [],
			topDataList: []

		}
	},
	mounted: function() {
		var that = this;
		mui.init({});

		//请求数据开始

		//请求数据结束
		mui.ready(function() {
            $.ajax({
                url:"insertLog",
                data:{"type":"plan"},
                type:"post",
                dataType:"json",
                success : function(){}
            });
			var chartZy = echarts.init(document.getElementById('zy-type'));
			var chartFd = echarts.init(document.getElementById('fd-type'));
			var chartState = echarts.init(document.getElementById('state'));
			loading.show();
			$.getJSON('/define/getPlanTodayChart/', {}, function(res) {

				that.roadNameArray = res.roadNameArray;

				that.roadValueArray = res.roadValueArray;

				that.workNameArray = res.workNameArray;

				that.workValueArray = res.workValueArray

				that.topSetName = res.topSetName;

				that.topDataList = res.topDataList
				// 指定图表的配置项和数据
				var zyoption = {
					title: false,
					legend: {
						orient: 'horizontal',
						left: 'center',
						data: that.workNameArray
					},
					series: [{
						name: '作业类型统计',
						type: 'pie',
						radius: '45%',
						center: ['50%', '60%'],
                        color: ['#58B7FF', '#ed3f14', '#8492A6', '#19be6b', '#ff9900','#e924f1','#88af00'],
						data: that.workValueArray,
						labelLine: {
							normal: {
								length: 0
							}
						},
						itemStyle: {
							normal: {
								label: {
									show: true,
									formatter: '{c}条'
								},
								labelLine: {
									show: true
								}
							},
							emphasis: {
								shadowBlur: 10,
								shadowOffsetX: 0,
								shadowColor: 'rgba(0, 0, 0, 0.5)'
							}
						}

					}]
				};
				var fdoption = {
					title: false,
					legend: {
						orient: 'horizontal',
						left: 'center',
						data: that.roadNameArray
					},
					series: [{
						name: '封道类型统计',
						type: 'pie',
						radius: '45%',
						center: ['50%', '60%'],
						color: ['#58B7FF', '#ed3f14', '#8492A6', '#19be6b', '#ff9900'],
						data: that.roadValueArray,
						labelLine: {
							normal: {
								length: 0
							}
						},
						itemStyle: {
							normal: {
								label: {
									show: true,
									formatter: '{c}条'
								},
								labelLine: {
									show: true
								}
							},
							emphasis: {
								shadowBlur: 10,
								shadowOffsetX: 0,
								shadowColor: 'rgba(0, 0, 0, 0.5)'
							}
						}

					}]
				};
				var stateoption = {
					title: false,
					legend: {
						orient: 'horizontal',
						left: 'center',
						data: that.topSetName
					},
					series: [{
						name: '数目统计',
						type: 'pie',
						radius: '45%',
						center: ['50%', '60%'],
						color: ['#58B7FF', '#ed3f14', '#8492A6', '#19be6b', '#ff9900'],
						data: that.topDataList,
						labelLine: {
							normal: {
								length: 0
							}
						},
						itemStyle: {
							normal: {
								label: {
									show: true,
									formatter: '{c}条'
								},
								labelLine: {
									show: true
								}
							},
							emphasis: {
								shadowBlur: 10,
								shadowOffsetX: 0,
								shadowColor: 'rgba(0, 0, 0, 0.5)'
							}
						}

					}]
				};

				chartZy.setOption(zyoption);
				chartFd.setOption(fdoption);
				chartState.setOption(stateoption);
				chartZy.on('click', function(e) {
					mui.openWindow({
						url: 'dayMaintenance.html?projecttype=' + e.name,
						id: 'satedetail'
					})
				});
				chartFd.on('click', function(e) {
					mui.openWindow({
						url: 'dayMaintenance.html?roadclosure=' + e.name,
						id: 'zydetail'
					})
				});
				chartState.on('click', function(e) {
					mui.openWindow({
						url: 'dayMaintenance.html?complete_status=' + e.name,
						id: 'fddetail'
					})
				});
				loading.hide();
			})

		})
	}
})